<template>
  <!--字典编辑弹框-->
  <el-dialog
      v-model="dialogVisible"
      :title="title"
      width="900"
      :before-close="handleClose">
    <avue-form
        v-model="form"
        :ref="refName"
        :option="option"
        :table-loading="tableLoading"
        @submit="submit">
    </avue-form>
    <template #footer>
      <div class="dialog-footer">
        <el-button type="primary" @click="submitForm()">
          <span style="margin-left: 6px">保 存</span>
        </el-button>
        <el-button @click="dialogVisible = false">
          <span style="margin-left: 6px">取 消</span>
        </el-button>
      </div>
    </template>
  </el-dialog>
</template>

<script setup>
import {option} from '@/table/sys/dict/list.js'
import {useFormMixins} from "@/table/useFormMixins.js";
//获取父组件方法
const emit = defineEmits(['getList'])

//移除第一个ID元素
if (option.column[0].prop === 'id') {
  option.column.splice(0, 1)
}
//移除按钮
option.submitBtn = false;
option.emptyBtn = false;

const httpService = inject("httpService")
const util = inject("util")

//定义表单的ref
const crud = ref(null)

//定义标题
const title = ref(null);

//弹框标识
const dialogVisible = ref(false);

/**
 * 弹框关闭方法
 * @param done
 */
const handleClose = (done) => {
  done();
}

/**
 *
 * @param newForm 传入的数据
 * @param newTitle 传入的标题
 */
const openDia = (newForm = {}, newTitle = '') => {
  Object.keys(form.value).forEach(key => delete form.value[key])
  Object.assign(form.value, newForm)
  title.value = newTitle;
  //找到字典类型列-判断是否可以修改类型，和编码
  let dictType=option.column.find(x=>x.prop==='dictType');
  let dictCode=option.column.find(x=>x.prop==='dictCode');
  dictCode.disabled = form.value.dictType === 'system';
  dictType.disabled = form.value.dictType === 'system';
  //判断是否可以修改字典
  dialogVisible.value = true;
}
const {
  form,
  refName,
  tableLoading,
  handleSave,
  handleUpdate
} = useFormMixins(option, "sys-dict", {
  isGetList: false,
  funExecuteCompleted: () => {
    dialogVisible.value = false;
    emit('getList')
  }
})

/**
 * 提交表单
 */
const submitForm = () => {
  crud.value.submit();
}

/**
 * 提交数据
 * @param form
 * @param done
 */
const submit = (form, done) => {
  if (util.isEmpty(form.id)) {
    handleSave(form, done)
  } else {
    handleUpdate(form, done)
  }
}

// emits
defineExpose({
  openDia
})

</script>

<style scoped>

</style>
